<script setup lang="ts">
import CreateAreaBox from "@/views/Student/personal/component/create-area-box.vue";
import {reactive,ref} from  "vue";
import {useRequest} from "vue-hooks-plus";
import {postCurriculumGetCurriculumBase, postCurriculumGetCurriculumFinish} from "@/apis/student";

const pagination = reactive<IPageInfo>({
  onChange: (page: number,pageSize) => {
    pagination.pageNum = page
    pagination.pageSize = pageSize
    run()
  },
  pageNum:1,
  pageSize: 8,
  total: 0,
  hideOnSinglePage: true,
  pageSizeOptions:['10', '20', '30', '40']
});
let data = ref<any>([])
const { loading,run } = useRequest(()=> postCurriculumGetCurriculumFinish({
  pageNum: pagination.pageNum,
  pageSize: pagination.pageSize
}),{
  onSuccess: ((res) => {
    console.log(res.data.list)
    data.value = res.data.list
  })
})

</script>

<template>
  <CreateAreaBox title="已完成课程">
    <a-list :grid="{gutter: 12, column: 4 }"
            :pagination="pagination"
            :data-source="data"
    >
      <template #renderItem="{ item }">
        <a-list-item>
          <a-card :title="item.curriculumName">
            课程节点：{{ item.curriculumNode }}
            <p>课程类型： {{ item.curriculumType }}</p>
          </a-card>
        </a-list-item>
      </template>
    </a-list>
  </CreateAreaBox>
</template>

<style scoped lang="scss">

</style>
